<template>
  <div>
    <!-- 3.绑定上 -->
    <h1 ref="hRef">我是h1标签</h1>
    <Hello ref="HelloRef"></Hello>
  </div>
</template>

<script>
import Hello from './components/Hello.vue'
import { ref, onMounted } from 'vue'
export default {
  components: {
    Hello
  },
  setup() {
    // 1. 创建一个空的ref对象
    const hRef = ref(null)
    const HelloRef = ref(null)
    onMounted(() => {
      // 4.在onMounted中使用
      console.log(hRef.value)
      hRef.value.style.backgroundColor = 'pink'
      HelloRef.value.sayHi()
    })
    // 2. ruturn出去
    return {
      hRef,
      HelloRef
    }
  }
}
</script>

<style>

</style>
